﻿<UserControl x:Class="SheepClock.CustomUIComponents.Switch"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    d:DesignHeight="40" d:DesignWidth="80">
	<UserControl.Resources>
		<Storyboard x:Name="TurnONStoryboard">
			<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="Slider">
				<EasingDoubleKeyFrame KeyTime="0" Value="0">
					<EasingDoubleKeyFrame.EasingFunction>
						<CubicEase EasingMode="EaseOut"/>
					</EasingDoubleKeyFrame.EasingFunction>
				</EasingDoubleKeyFrame>
				<EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="52">
					<EasingDoubleKeyFrame.EasingFunction>
						<CubicEase EasingMode="EaseOut"/>
					</EasingDoubleKeyFrame.EasingFunction>
				</EasingDoubleKeyFrame>
			</DoubleAnimationUsingKeyFrames>
			<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="FillRect">
				<EasingDoubleKeyFrame KeyTime="0" Value="0">
					<EasingDoubleKeyFrame.EasingFunction>
						<CubicEase EasingMode="EaseOut"/>
					</EasingDoubleKeyFrame.EasingFunction>
				</EasingDoubleKeyFrame>
				<EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="1">
					<EasingDoubleKeyFrame.EasingFunction>
						<CubicEase EasingMode="EaseOut"/>
					</EasingDoubleKeyFrame.EasingFunction>
				</EasingDoubleKeyFrame>
			</DoubleAnimationUsingKeyFrames>
		</Storyboard>
		<Storyboard x:Name="TurnOFFStoryboard">
			<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="Slider">
				<EasingDoubleKeyFrame KeyTime="0" Value="52">
					<EasingDoubleKeyFrame.EasingFunction>
						<CubicEase EasingMode="EaseOut"/>
					</EasingDoubleKeyFrame.EasingFunction>
				</EasingDoubleKeyFrame>
				<EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0">
					<EasingDoubleKeyFrame.EasingFunction>
						<CubicEase EasingMode="EaseOut"/>
					</EasingDoubleKeyFrame.EasingFunction>
				</EasingDoubleKeyFrame>
			</DoubleAnimationUsingKeyFrames>
			<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="FillRect">
				<EasingDoubleKeyFrame KeyTime="0" Value="1">
					<EasingDoubleKeyFrame.EasingFunction>
						<CubicEase EasingMode="EaseOut"/>
					</EasingDoubleKeyFrame.EasingFunction>
				</EasingDoubleKeyFrame>
				<EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0">
					<EasingDoubleKeyFrame.EasingFunction>
						<CubicEase EasingMode="EaseOut"/>
					</EasingDoubleKeyFrame.EasingFunction>
				</EasingDoubleKeyFrame>
			</DoubleAnimationUsingKeyFrames>
		</Storyboard>
	</UserControl.Resources>
    
    <Grid x:Name="LayoutRoot">
        <Rectangle Height="32" 
                   HorizontalAlignment="Left"
                   Name="rectangle1" 
                   Stroke="{StaticResource PhoneContrastBackgroundBrush}"
                   StrokeThickness="2"
                   VerticalAlignment="Top"
                   Width="72"
                   Margin="4,4,0,0"/>
        <Rectangle Height="28"
                   Width="68"
                   HorizontalAlignment="Left"
                   Margin="6,6,0,0" 
                   Name="FillRect" 
                   Stroke="White" 
                   StrokeThickness="0"
                   VerticalAlignment="Top"
                   Fill="{StaticResource PhoneAccentBrush}"
                   Opacity="0"/>
        <Rectangle Height="40"
                   Width="20"
                   HorizontalAlignment="Left"
                   Margin="4,0,0,0" 
                   Name="Slider" 
                   Stroke="{StaticResource PhoneContrastBackgroundBrush}" 
                   StrokeThickness="1"
                   VerticalAlignment="Top"
                   Fill="{StaticResource PhoneContrastBackgroundBrush}"
                   RenderTransformOrigin="0.5,0.5"
                   Opacity="100">
        	<Rectangle.RenderTransform>
        		<CompositeTransform/>
        	</Rectangle.RenderTransform>
        </Rectangle>
    </Grid>
</UserControl>
